<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<html:xhtml />
<script type="text/javascript">
    $(document).ready(function() {
        // 'DataTablize' the tables
        $("#snpTable").dataTable({
            "bPaginate": true,
            "sPaginationType": "full_numbers",
            "bFilter": true,
            "bJQueryUI": true,
            "bAutoWidth": false,
            "aoColumns": [{"sType": "html"},
                {"sType": "html"},
                {"sType": "numeric" },
                {"bSearchable": false},
                {"bSearchable": false},
                {"bSearchable": false},
                {"bSearchable": false}]
        });
        $("#geneTable").dataTable({
            "bPaginate": true,
            "sPaginationType": "full_numbers",
            "bFilter": true,
            "bJQueryUI": true,
            "bAutoWidth": false,
            "aoColumns": [{"sType": "html"},
                {"sType": "numeric" },
                {"bSortable": false, "bSearchable": false}]
        });

        // Init help dialogs
        $("#ldPlotDesc").dialog({
            autoOpen: false,
            width: 400,
            position: "right"
        });
        $("#ldPlotHelp").click(function() {
            $("#ldPlotDesc").dialog("open");
        });
        $("#ldPlotLink").click(function() {
            $("#ldPlotDesc").dialog("open");
        });
    });
</script>
<div id="allList" class="content list">
    <h2>Search Result</h2>
    <logic:notEmpty name="allListForm" property="snpList">
        <h3>SNPs</h3>
        <table id="snpTable" cellpadding="0" cellspacing="0" border="0" class="display">
            <thead>
                <tr>
                    <!-- GOTCHA: Manually adding 'ui-state-default' classes to match appearance.
                         NOTE: There were couple old forum threads that stated that dataTable cannot
                         handle multiple th's in a row. This table, with two th's in each column seems
                         to be working now. However, this might cause a problem in future changes. -->
                    <th colspan="3" class="ui-state-default">&nbsp;</th>
                    <th colspan="4" class="ui-state-default">Genotyping Status</th>
                </tr>
                <tr>
                    <th>RS number</th>
                    <th>Gene</th>
                    <th>Chromosome</th>
                    <logic:iterate id="cohort" name="allListForm" property="cohortList" indexId="i" length="4">
                        <th><bean:write name="cohort" property="name"/></th>
                    </logic:iterate>
                </tr>
            </thead>
            <tbody>
                <logic:iterate id="snpInfo" name="allListForm" property="snpList">
                    <tr>
                        <td>
                            <a href="<html:rewrite page="/snpSummary.do" />?rsNumber=<bean:write name="snpInfo" property="snp.rsNumber" />">
                                <bean:write name="snpInfo" property="snp.rsNumber" />
                            </a>
                        </td>
                        <td>
                            <a href="<html:rewrite page="/geneSummary.do" />?geneName=<bean:write name="snpInfo" property="snp.gene.name" />">
                                <bean:write name="snpInfo" property="snp.gene.name" />
                            </a>
                        </td>
                        <td><bean:write name="snpInfo" property="snp.chromosome" /></td>
                        <logic:iterate id="status" name="snpInfo" property="statusList" indexId="i" length="4">
                            <td>
                                <logic:notEmpty name="status">
                                    <logic:equal name="status" property="valid" value="true">
                                        <div title="Passed" class="ui-icon passed ui-icon-check" />
                                    </logic:equal>
                                    <logic:notEqual name="status" property="valid" value="true">
                                        <div title="Failed" class="ui-icon failed ui-icon-closethick" />
                                    </logic:notEqual>
                                </logic:notEmpty>
                                <logic:empty name="status">
                                    <div title="Not Available" class="ui-icon na ui-icon-help" />
                                </logic:empty>
                            </td>
                        </logic:iterate>
                    </tr>
                </logic:iterate>
            </tbody>
        </table>
    </logic:notEmpty>
    <logic:notEmpty name="allListForm" property="geneList">
        <h3>Genes</h3>
        <table id="geneTable" cellpadding="0" cellspacing="0" border="0" class="display">
            <thead>
                <tr>
                    <th>Gene</th>
                    <th>SNPs Genotyped</th>
                    <th>LD Plots<span id="ldPlotHelp" class="ui-icon help ui-icon-info" /></th>
                </tr>
            </thead>
            <tbody>
                <logic:iterate id="geneLink" name="allListForm" property="geneList" type="icapture.beans.DB.GeneLink">
                    <tr>
                        <td>
                            <a href='<html:rewrite page="/geneSummary.do" />?geneName=<bean:write name="geneLink" property="name" />'>
                                <bean:write name="geneLink" property="name" />
                            </a>
                        </td>
                        <td>
                            <bean:write name="geneLink" property="snpCount" />
                        </td>
                        <td>
                            <a onclick="openLdPlot('<bean:write name="geneLink" property="name" />', 'CAPPS', 3);">CAPPS</a> |
                            <a onclick="openLdPlot('<bean:write name="geneLink" property="name" />', 'SAGE', 4);">SAGE</a> |
                            <a onclick="openLdPlot('<bean:write name="geneLink" property="name" />', 'SLSJ', 5);">SLSJ</a> |
                            <a onclick="openLdPlot('<bean:write name="geneLink" property="name" />', 'Busselton', 6);">Busselton</a>
                        </td>
                    </tr>
                </logic:iterate>
            </tbody>
        </table>
    </logic:notEmpty>
    <logic:notEmpty name="allListForm" property="pathwayList">
        <h3>Kegg Pathways</h3>
        <ul>
            <logic:iterate id="kegPathway" name="allListForm" property="pathwayList">
                <li>
                    <a href="<html:rewrite action="keggPathway"/>?pathwayID=<bean:write name="kegPathway" property="id"/>"
                       title="<logic:iterate id="kegGene" name="kegPathway" property="geneList"><bean:write name="kegGene" property="name"/> </logic:iterate>">
                        <bean:write name="kegPathway" property="name"/>
                    </a>
                </li>
            </logic:iterate>
        </ul>
    </logic:notEmpty>
</div>
<tiles:insert name="ldPlotDesc" />
<tiles:insert name="ldPlotModal" />